<template>
  <div style="margin-top: 20px;padding: 20px;background-color: #FFFFFF">
    <div style="padding:0 0 20px 0">
      <a-form-model ref="ruleForm1" :model="form" layout="inline" :rules="rules">
        <div class="mode_item">
          <a-form-model-item label="模版名称" prop="templateName">
            <a-input v-model="form.templateName" placeholder="请输入" :disabled="pass2"/>
          </a-form-model-item>
          <a-form-model-item :wrapper-col="{ offset: 0 }" style="margin-bottom: 0" v-if="!pass2">
            <a-button class="Indormation-list-CX" type="primary" @click="onQuery">保存</a-button>
          </a-form-model-item>
        </div>
      </a-form-model>
    </div>
    <div style="position:relative;">
      <j-editor v-model="form.content"/>
      <div style="width: 100%;height: 100%;background-color: rgba(255,255,255,0);position:absolute;top: 0;left: 0;cursor: no-drop" v-if="pass2"></div>
    </div>


  </div>
</template>


<script>
import JEditor from '@/components/jeecg/JEditor'

import Vue from "vue";
import {USER_INFO} from "@/store/mutation-types";
import {addText, editText, queryId} from "@api/wxSmuggle/system";
export default {
  name: "templet",
  components:{ JEditor },
  data(){
    return {

      form:{},
      rules: {
        templateName: [{ required: true, message: '请输入模版名称', trigger: 'blur' }]
      },
      pass:undefined,
      pass1:undefined,
      pass2:true,
      pass3:true,
    }
  },
  mounted() {
    let user = Vue.ls.get(USER_INFO)
    console.log(user)
    this.form.createName = user.username
    if(this.$route.query.item === 'true'){
      this.pass2 = true
      this.qidong(this.$route.query.id)
    }
    if(this.$route.query.item === 'false'){
      console.log(1)
      this.pass2 = false
      this.qidong(this.$route.query.id)
    }
    if(this.$route.query.item === '3'){
      this.pass2 = false
      this.pass3 = false
    }
  },
  methods:{
    qidong(val){
      console.log(val)
      queryId({id:val}).then(ser => {
        console.log(ser)
        if(ser.success){
          this.form = ser.result
          // this.form.usageStatus === '0' ? this.form.usageStatus = '是' : this.form.usageStatus = '否'
          console.log(this.form);
        }
      })
    },
    submitForm() {
      this.$refs.ruleForm1.validate(valid => {
        console.log(valid)
        // this.passCheck = valid
        this.pass = valid
      });
    },
    onQuery(){
      console.log(this.form)
      this.submitForm()
      if(!this.form.content || this.form.content === '') {
        this.pass1 = false
      } else {
        this.pass1 = true
      }
      if(this.pass && this.pass1){
        if(!this.pass3){
          addText(this.form).then(ser => {
            console.log(ser)
            if(ser.success){
              this.$router.go(-1)
              this.$message.success('添加成功', 2,);
            } else {
              this.$message.warn('添加失败！')
            }
          }).catch(err => {
            this.$message.warn('添加失败！')
          })
        } else {
          editText(this.form).then(ser => {
            if(ser.success){
              this.$router.go(-1)
              this.$message.success('编辑成功', 2,);
            } else {
              this.$message.warn('编辑成功！')
            }
          }).catch(err => {
            this.$message.warn('编辑成功！')
          })
        }
      } else {
        this.$message.warn('请检查数据！')
      }

    }
  }
}
</script>

<style scoped>

</style>